<template>
	<div class="app">
		<h2>我是App组件，{{msg}}</h2>
		<h2 v-text="msg">你好</h2>
		<h2 v-text="msg">你好</h2>
		<div v-html="msg2">你好</div>
		<div v-html="msg3">你好</div>
		<h2 v-once>初始的和为：{{sum}}</h2>
		<h2>当前求和为：{{sum}}</h2>
		<button @click="sum++">点我sum+1</button>
		<div v-pre>
			<h1>我是一些文字</h1>
			<h2>我是另一些文字</h2>
			<ul>
				<li>xxx</li>
				<li>yyy</li>
			</ul>
		</div>
	</div>
</template>

<script>
	export default {
		name:'App',
		data() {
			return {
				msg:'欢迎学习Vue',
				msg2:'<h1>欢迎来到尚硅谷</h1>',
				msg3:"<a href=javascript:alert(1)>我找到强哥一些“美丽”的照片了，快看</a>",
				sum:0
			}
		}
	}
</script>

<style scoped>
	.app{
		background-color: gray;
		padding: 10px;
	}
</style>